<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>添加</title>
    <link href="../../layuiadmin/js/adm/css/bootstrap.css" rel="stylesheet">
    <script src="../../layuiadmin/js/adm/js/vue.js"></script>
    <script src="../../layuiadmin/js/adm/js/vue-resource.js"></script>
    <script src="../../layuiadmin/js/adm/js/jquery.min.js"></script>
    <script src="../../layuiadmin/js/adm/js/bootstrap.js"></script>
    <script src="../../layuiadmin/js/adm/js/getUrlParam.js"></script>
    <script src="../../layuiadmin/js/adm/js/date.js"></script>
    <!-- 引入样式 -->
    <link rel="stylesheet" href="https://unpkg.com/element-ui@1.4/lib/theme-default/index.css">
    <!-- 引入组件库 -->
    <script src="https://unpkg.com/element-ui@1.4/lib/index.js"></script>
    <script src="../../layuiadmin/js/adm/js/jquery.cookie.js"></script>
    <style>
            td{
               padding-left: 10px
            }
    </style>
</head>
<body>
    <div id="app"   class="container-fluid" style="margin: 20px 8%">
        <h4 style="size: 30px;margin-top: 30px"><b>丨基本资料</b></h4>
        <table border="1px" style="width: 100%;height: 170px;border: none;margin: 10px 0 0 15px" >
            <tr>
                <td>
                    <span style="color: darkgray">发件人：</span><br>
                    {{dispatch.empId.empName}}
                </td>
                <td>
                    <span style="color: darkgray">发件日期：</span><br>
                    {{dispatch.taketime}}
                </td>
                <td>
                    <span style="color: darkgray">收件方式：</span><br>
                    {{dispatch.companyId.companyName}}
                </td>
            </tr>
            <tr>
                <td><span style="color: darkgray">快件类型：</span><br>
                    {{dispatch.espressId.espressName}}
                </td>
                <td style="border: none"></td>
                <td style="border: none"></td>
            </tr>
        </table>
        <h4 style="size: 30px;margin-top: 30px"><b>丨详细信息</b></h4>
        <table border="1px" style="width: 100%;height: 270px;border: none;margin: 15px 0 0 15px" >
            <tr>
                <td v-if="dispatch.caseId==null">
                    <span style="color: darkgray">案件：</span><br>
                </td>
                <td v-if="dispatch.caseId!=null">
                    <span style="color: darkgray">案件：</span><br>
                    {{dispatch.caseId.caseId}}
                </td>
              
                <td>
                    <span style="color: darkgray">快递单号：</span><br>
                    {{dispatch.numbers}}
                </td>
                <td>
                    <span style="color: darkgray">快递费：</span><br>
                    {{dispatch.cost}}
                </td>
            </tr>
            <tr>
                <td>
                    <span style="color: darkgray">收件人：</span><br>
                    {{dispatch.recipients}}
                </td>
                <td>
                    <span style="color: darkgray">收件单位：</span><br>
                    {{dispatch.addressee}}
                </td>
                <td>
                    <span style="color: darkgray">联系电话：</span><br>
                    {{dispatch.phone}}
                </td>
            </tr>
            <tr>
                <td colspan="3">
                    <span style="color: darkgray">备注说明：</span><br>
                    {{dispatch.remark}}
                </td>
            </tr>

        </table>
        

    </div>
    

    <script>
          var vm=new Vue({
            el:'#app',
            data:{
                dispatch:{
                    dispatchId:"",
                    empId:{
                        empId:"",
                        empName:""
                    },
                    taketime:"",
                    companyId:{
                        companyId:"",
                        companyName:""
                    },
                    espressId:{
                        espressId:"",
                        espressName:""
                    },
                    lempId:{
                        lempId:"",
                        empName:""
                    },
                    caseId:{
                        caseId:""
                    },
                    numbers:"",
                    cost:"",
                    recipients:"",
                    addressee:"",
                    site:"",
                    phone:"",
                    remark:""
                }
            },
            methods: {
                postinfo(id){
                    this.$http.post('http://localhost:8080/register/dispatchgetbyid',{"id":id},{emulateJSON:true}).then(resutl =>{
                        var dat=eval("("+resutl.body+")")
                        this.dispatch=dat
                    })
                }
            },
            created () {
                var id = getUrlParam("id")
                this.postinfo(id)
            }
        })      
    </script>

</body>
</html>